<template>
	<view class="house">
		<life-empty v-if="!houseList.length" url="/pkg-house/add-house/add-house" tip="你还没有认证房屋，请点击" linkText="跳转"
			@click-text="onClick">
		</life-empty>

		<view v-else class="house-list">
			<house-item :houseList="houseList" @click="delClick"></house-item>
			<life-button icon="../../static/icon/add.png" @click="goAddHouse">添加新房屋</life-button>
		</view>
	</view>
</template>

<script>
	import {
		getHouseList
	} from '../../api/house'
	import {
		delHouse
	} from '../../api/room'
	export default {
		data() {
			return {
				houseList: []
			}
		},
		onLoad() {
			this.getHouseList()
		},
		methods: {
			onClick() {
				console.log('跳转')
			},
			async getHouseList() {
				const res = await getHouseList()
				// console.log(res)
				this.houseList = res.data
			},
			async delClick(id) {
				// const findRes = this.houseList.findIndex(item => item.id === id)
				// this.houseList.splice(findRes, 1)
				const res = await delHouse(id)
				// console.log(res)
				this.getHouseList()
			},
			goAddHouse() {
				uni.navigateTo({
					url: "/pkg-house/add-house/add-house"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.house {
		height: 100%;
		background-color: #FAFAFA;
		padding: 0 20rpx;

		.house-list {
			::v-deep .u-swipe-action-item__content {
				background-color: unset !important;
			}

			::v-deep .u-swipe-action-item {
				background-color: #CC655E;
				border-radius: 16rpx;
				margin-bottom: 20rpx;
			}

			::v-deep .u-swipe-action {
				margin-bottom: 20rpx;
			}
		}
	}
</style>
